<!--
 * @Author: your name
 * @Date: 2021-09-03 14:14:17
 * @LastEditTime: 2021-09-03 14:46:13
 * @LastEditors: your name
 * @Description: In User Settings Edit
 * @FilePath: /yashendaoren/src/views/tools.vue
-->
<template>
  <div class="tools">
    <ul>
      <li v-for="(item, index) in tools" :key="index">
        <a target="_blank" :href="item.address">
          <div>{{ item.name }}</div> 
          <div class="description">{{item.description }}</div>
        </a>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "tools",
  data() {
    return {
      tools: [
        {
          name: "JSON.CN",
          description: "json在线格式化工具",
          address: "https://www.json.cn",
        },
        {
          name: "正则表达式测试",
          description: "在线正则表达式测试 常用正则",
          address: "https://tool.oschina.net/regex/",
        },
        {
          name: "草料二维码",
          description: "在线生成二维码工具",
          address: "https://cli.im",
        },
        {
          name: "颜色值转换",
          description: "RGB颜色值与十六进制颜色码转换工具",
          address: "https://www.sioe.cn/yingyong/yanse-rgb-16/",
        },
        {
          name: "TinyPNG-压缩图",
          description: "图片压缩工具",
          address: "https://tinypng.com/",
        },
        {
          name: "阿里图标库",
          description: "阿里矢量图标库",
          address: "https://www.iconfont.cn",
        },
        {
          name: "BootCDN",
          description: "CND加速服务",
          address: "https://www.bootcdn.cn",
        },
        {
          name: "Gitee",
          description: "开源中国/码云 代码库",
          address: "https://gitee.com/",
        },
      ],
    };
  },
};
</script>

<style scoped>

</style>
